{extend name="layout/common_layout" /}
{block name="css"}
<style>
    .dx_father {height: 45px;margin-bottom: 10px;}
    .dx_father .dx_child {float:left;margin-left: 0px;}
    .dx_father .dx_child_right {margin-left:10px;width:200px;}
    .dx_father .dx_child_right_b {margin-left:10px}
</style>
{/block}
{block name="body"}
    <!--tab标签-->
    <div class="layui-tab layui-tab-brief">
        <ul class="layui-tab-title">
            <li class=""><a href="{:url('admin/user/index')}">用户管理</a></li>
            <li class="layui-this">账号绑定</li>
        </ul>
        <div class="layui-tab-content" style='min-height:800px;'>
            <div class="layui-tab-item layui-show">
                <form class="layui-form form-container" action="{:url('admin/userbind/update')}" method="post">
                    <div class="layui-form-item">
                        <label class="layui-form-label">用户名</label>
                        <div class="layui-input-block">
                            <input type="text" value="{$user.username}" disabled="disabled"  class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">手机</label>
                        <div class="layui-input-block">
                            <input type="text"  value="{$user.mobile}" disabled="disabled" class="layui-input">
                        </div>
                    </div>
                    
                    <div class="layui-form-item" >
                        <label class="layui-form-label">网站选择</label>
                    </div>
                    
                    {empty name="userbind"}
                    
                        <div class="layui-form-item" style="margin-left:110px;" id='box_father'>
                            <div class="dx_father">
                                <div class="layui-input-block dx_child">
                                    <select name="type[]">
                                        <option value="1" >大兴</option>
                                        <option value="2" >凤凰</option>
                                    </select>
                                </div>
                                <div class="layui-input-block dx_child dx_child_right" >
                                    <input type="text" name="account[]" value="" required lay-verify="required" placeholder="网站用户名" class="layui-input">
                                </div>
                                <div class="layui-input-block dx_child dx_child_right_b" >
                                    <a class="layui-btn" id='add_box'>添加</a>
                                </div>
                            </div>
                        </div>
                    {else /}
                        {foreach $userbind as $k=>$vo} 
                            <div class="layui-form-item" style="margin-left:110px;" id='box_father'>
                                <div class="dx_father">
                                    <div class="layui-input-block dx_child">
                                        <select name="type[]">
                                            <option value="1" {if condition="$vo.type eq 1"}selected{/if} >大兴</option>
                                            <option value="2" {if condition="$vo.type eq 2"}selected{/if}>凤凰</option>
                                        </select>
                                    </div>
                                    <div class="layui-input-block dx_child dx_child_right" >
                                        <input type="text" name="account[]" value="{$vo['account']}" required lay-verify="required" placeholder="网站用户名" class="layui-input">
                                    </div>
                                    <div class="layui-input-block dx_child dx_child_right_b" >
                                        {if condition="$k eq 0"}
                                            <a class="layui-btn" id='add_box'>添加</a>
                                        {else /}
                                            <a class='del_father layui-btn layui-btn-primary'>删除</a>
                                        {/if}
                                    </div>
                                </div>
                            </div>
                        {/foreach}
                        
                    {/empty}
                    
                    
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <input type="hidden" name="id" value="{$user.id}">
                            <button class="layui-btn" lay-submit lay-filter="*">更新</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
 
    <div  style='display: none;' id='static_box'>
        <div class="dx_father">
            <div class="layui-input-block dx_child">
                <select class='select_dx' name="type[]">
                    <option value="1" >大兴</option>
                    <option value="2" >凤凰</option>
                </select>
            </div>
            <div class="layui-input-block dx_child dx_child_right" >
                <input type="text" name="account[]" value="" required lay-verify="required" placeholder="网站用户名" class="layui-input">
            </div>
            <div class="layui-input-block dx_child dx_child_right_b" >
                <a class='del_father layui-btn layui-btn-primary'>删除</a>
            </div>
        </div>
    </div>
    
{/block}

{block name='js'}
<script src="/static/layui/layui.all.js"></script>
<script>
        layui.use(['form'], function () {
            var form = layui.form;
            $('#add_box').click(function(){
                dd = $('#static_box .dx_father').clone();
                $('#box_father').append(dd)
                form.render('select');//没有写这个，操作后没有效果
            })
            $('.del_father').click(function(){
                 $(this).parents('.dx_father').remove();
            })
           $("#box_father").on("click",".del_father",function(){
               $(this).parents('.dx_father').remove();
            });
        });
</script>
{/block}